<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<link rel="stylesheet" href="/static/jquery.json-viewer.css"></link>
<script src="https://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="/static/jquery.json-viewer.js"></script>
<style>
    table {
        border-collapse: collapse;
        border: none;
        line-height:2em;
    }
</style>
<body>
<h2>EasyTask-L</h2>
<div>
    ZK注册信息：<span id="zkNode"></span>
</div>
<br>
<table width="100%">
    <tr style="height: 7em">
        <td style="width:60%">
            <table width="100%">
                <tr>
                    <td width="13%"></td>
                    <td width="38%">任务名:<input type="text" id="name" value="测试" style="width:60px">&nbsp;&nbsp;
                        线程数:<input type="text" id="threadqty" value="5" style="width:40px">&nbsp;&nbsp;
                        单线程任务数:<input type="text" id="count" value="5" style="width:40px">
                    </td>
                    <td>
                        <input type="button" value="删除任务" onclick="deleteTask()">
                        <input type="text" id="delTaskId">
                    </td>
                </tr>
                <tr>
                    <td><input type="button" value="添加一次性任务" onclick="addOnceTask()"></td>
                    <td><input type="text" id="time" style="width:30px">秒后执行</td>
                    <td><div id="oncetaskId" style="width: 100%;height: 100px;overflow: scroll;white-space: nowrap">
                    </div></td>
                </tr>
                <tr>
                    <td><input type="button" value="添加周期任务" onclick="addPeriodTask()"></td>
                    <td>每隔<input type="text" id="period" style="width:30px">秒执行一次。
                        是否立即执行
                        <select id="immediately">
                            <option value="0" selected>否</option>
                            <option value="1">是</option>
                        </select></td>
                    <td><div id="periodtaskId" style="width: 100%;height: 100px;overflow: scroll;white-space: nowrap">

                    </div></td>
                </tr>
            </table>
        </td>
        <td rowspan="8" style="vertical-align:top">
            <input type="button" value="清除信息" onclick="clearInfo()">
            <br>
            <div style="width: 100%;height: 900px;overflow: scroll;white-space: nowrap">
                <ol id="taskInfo">
                </ol>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                环形队列任务数：<span id="spWaiteExcuteQty"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                分派任务线程池：
                等待任务数：<span id="dis_taskQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                执行中的线程数：<span id="dis_activeQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                核心线程数：<span id="dis_coreSize"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                执行任务线程池：
                等待任务数：<span id="work_taskQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                执行中的线程数：<span id="work_activeQty"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                核心线程数：<span id="work_coreSize"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                Netty连接池可用数：<span id="nettyPoolQty"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                Sqlite连接池可用数：<span id="sqlitePoolQty"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div>
                时钟差值信息：<span id="nodeClockDifferInfo"></span>
            </div>
        </td>
    </tr>
    <tr>
        <td style="vertical-align:top">
            TaskId:<input type="text" id="search"><input type="button" id="btnsearch" value="搜索" onclick="searchTaskId()">
            <div id="dbInfo" style="width: 68em;height: 800px;overflow: scroll">
                <pre id="json-renderer"></pre>
            </div>
        </td>
    </tr>
</table>

</body>
</html>
<script>
    $(function () {
        setInterval("showTaskInfo()", 1000);
        setInterval("showPoolsInfo()", 1000);
        setInterval("showNettyPoolsInfo()", 1000);
        setInterval("showSqlitePoolsInfo()", 1000);
        setInterval("showTaskId()", 5000);
        setInterval("showNodeClockDifferInfo()", 5000);
        setInterval("showZkNode()", 2000);
    });

    var showTaskInfoFlag=false;
    function showTaskInfo() {
        if(showTaskInfoFlag) return;
        showTaskInfoFlag=true;
        $.get("/m/taskInfo", function (data) {
            showTaskInfoFlag=false;
            array = eval(data)
            for(var i=0; i<array.length; i++)
            {
                $("#taskInfo").append("<li class='liTaskInfo'>"+array[i]+"</li>");
            }
        })
    }
    function showPoolsInfo() {
        $.get("/m/getPoolsInfo", function (data) {
            $("#spWaiteExcuteQty").text(data.waiteExcuteQty);
            $("#dis_taskQty").text(data.dispatch.taskQty);
            $("#dis_activeQty").text(data.dispatch.activeQty);
            $("#dis_coreSize").text(data.dispatch.coreSize);
            $("#work_taskQty").text(data.worker.taskQty);
            $("#work_activeQty").text(data.worker.activeQty);
            $("#work_coreSize").text(data.worker.coreSize);
        })
    }
    function showTaskId() {
        $.get("/m/getOnceTaskID", function (data) {
            $("#oncetaskId").html(data);
        });
        $.get("/m/getPeriodTaskID", function (data) {
            $("#periodtaskId").html(data);
        })
    }
   function showZkNode() {
       $.get("/m/getZKNode", function (data) {
           $("#zkNode").text(data);
       });
   }
    function clearInfo() {
        $(".liTaskInfo").remove();
    }

    function addOnceTask() {
        var data = {
            name: $('#name').val(),
            count: $('#count').val(),
            threadqty: $('#threadqty').val(),
            time: $('#time').val()
        }
        if (data.name == "") {
            alert("任务名不能为空!")
            return;
        }
        if (data.time == "") {
            alert("执行时间不能为空!")
            return;
        }
        $.post("/m/once", data, function (data) {
            $("#oncetaskId").text(data);
        })
    }

    function addPeriodTask() {
        var data = {
            name: $('#name').val(),
            count: $('#count').val(),
            threadqty: $('#threadqty').val(),
            period: $('#period').val(),
            immediately: $('#immediately').val()

        }
        if (data.name == "") {
            alert("任务名不能为空!")
            return;
        }
        if (data.period == "") {
            alert("执行周期不能为空!")
            return;
        }
        $.post("/m/period", data, function (data) {
            $("#periodtaskId").text(data);
        })
    }
    function searchTaskId() {
        if ($("#search").val() == "") {
            alert("任务ID不能为空!")
            return;
        }
        $.get("/m/searchDbInfo?taskId="+$("#search").val(), function (data) {
            $('#json-renderer').jsonViewer(data);
        })
    }
    function deleteTask()  {
        var tid=$('#delTaskId').val();
        if (tid == "") {
            alert("任务ID不能为空!")
            return;
        }
        $.get("/m/deleteTask?id="+tid, function (data) {
            alert(data);
        });
    }
    function showNettyPoolsInfo() {
        $.get("/m/getNettypoolInfo", function (data) {
            $("#nettyPoolQty").text(data);
        })
    }
    function showSqlitePoolsInfo() {
        $.get("/m/getSqlitePoolInfo", function (data) {
            $("#sqlitePoolQty").text(data);
        })
    }
    function showNodeClockDifferInfo() {
        $.get("/m/getNodeClockDifferInfo", function (data) {
            $("#nodeClockDifferInfo").text(data);
        })
    }
</script>
